<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    table {
        width: 40%;
        height: 60px;
        text-align: center;
    }
</style>
<body>
<table id="table" border="1px" cellspacing="0px">
    <tr>
        <td>姓名</td>
        <td>年龄</td>
        <td>操作</td>
    </tr>
    <tr>
        <td>马云</td>
        <td>50</td>
        <td><input type="button" onclick="del(this)" value="删除"></td>
    </tr>
</table>
<br>
<hr>
姓名:<input type="text" id="name"><br><br>
年龄:<input type="text" id="age"><br><br>
    <input type="button" value="保存" onclick="save()">
</body>
</html>

<script type="text/javascript">
    function save() {
    var tableObj = document.getElementById("table");
    var tr = document.createElement("tr")
    var td1 = document.createElement("td")
    var td2 = document.createElement("td")
    var td3 = document.createElement("td")
    var name = document.getElementById("name").value
        td1.innerText = name
    var age = document.getElementById("age").value
        td2.innerText = age

    td3.innerHTML = "<input onclick= 'del(this)' value='删除' type='button'>"
    tr.appendChild(td1)
    tr.appendChild(td2)
    tr.appendChild(td3)
    tableObj.appendChild(tr);
    }

    function del(obj) {
        obj.parentNode.parentNode.remove()
    }
</script>